import {
    createRouter,
    createWebHashHistory
} from 'vue-router'



// 1. 定义路由组件.
// 也可以从其他文件导入
import HelloWorld from '../components/HelloWorld.vue'
import MyComponent from '../components/MyComponent.vue';
import Login from "../components/Login.vue"
import Main from "../components/Main.vue"
import Top from "../components/Top.vue"
import Left from "../components/Left.vue"

// 定义映射规则
const routes = [{
        path: '/',
        component: Login
    },
    {
        path:"/main",
        children:[
            {path: "", components:{default:Main, top: Top, left: Left}},
            {path: "add", components: { default:HelloWorld, top: Top, left: Left}},
            {path: "update", components:{ default: MyComponent, top: Top, left: Left}}
        ]
        // component: Main
    }
]

const router = createRouter({
    // 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
      /*
          createWebHashHistory
              http://localhost:8080/#/home
             http://localhost:8080/#/about
            原理： a 锚点 
          createWebHistory:
             http://localhost:8080/home
             http://localhost:8080/about
           这种方式需要后台做重定向，否则会 404  
              原理： H5 pushState()
      */
    history: createWebHashHistory(),
    routes, // `routes: routes` 的缩写
  })

  export default router;